.BlogTitle {
  color: rgb(0, 0, 205);
  position: absolute;
  top: 0;
  left: 900px;
}

body {
  background-color: rgb(30, 144, 255, 0.5);
  z-index: 0;
}

.BlogLogo {
  width: 50px;
  height: 50px;
}

.BlogLogo > img {
  width: 100px;
  height: 100px;
}

.Banner {
  width: 1000px;
  height: 500px;
  position: absolute;
  top: 200px;
  left: 500px;
}

.Banner > img {
  width: 1000px;
  height: 500px;
  z-index: 1;
}

.floating-block {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 10px;
  background-color: rgba(0, 103, 163, 0.5); /* 宝石蓝色，半透明 */
  color: white;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  transition: opacity 0.3s ease; /* 平滑过渡效果 */
}

.Banner:hover .floating-block {
  display: block;
  opacity: 1; /* 确保区块完全可见 */
}

.nav {
  width: 300px;
  height: 300px;
  list-style: none;
  background-color: aquamarine;
  border-radius: 10%;
  position: absolute;
  left: 160px;
  top: 200px;
}

.NavValues {
  display: inline;
  width: 300px;
  height: 100px;
  float: left;
  border-radius: 10%;
}

.NavValues:hover {
  background-color: blue;
}

.NavValues > a {
  color: rgb(0, 0, 128);
  text-align: center;
  text-decoration: none;
  font-size: 50px;
  font-weight: bold;
}

.nevelArea {
  background-color: rgb(192, 192, 192, 0.7);
  color: black;
  width: 1000px;
  height: 400px;
}

#visitChart {
  width: 500px;
  height: 300px;
}

footer {
  color: rgb(0, 0, 128);
  text-align: center;
  font-size: 15px;
  font-weight: bold;
  width: 100%;
  height: 50px;
  background-color: rgb(100, 149, 237, 0.5);
  position: absolute;
  top: 1400px;

}

.comment {
  width: 100px;
  height: 30px;
  border-radius: 10%;
  border-style: none;
  background-color: rgb(0, 206, 209);
}

.login {
  width: 100px;
  height: 30px;
  background-color: aqua;
  border-radius: 10%;
  border-style: none;
  font-size: 13px;
  position: absolute;
  top: 0;
  left: 1800px;
  cursor: pointer;
  outline: none;
  transition: background-color 0.3s ease;
}

.resigter {
  width: 100px;
  height: 30px;
  background-color: aqua;
  border-radius: 10%;
  border-style: none;
  font-size: 13px;
  position: absolute;
  top: 0;
  left: 1680px;
  cursor: pointer;
  outline: none;
  transition: background-color 0.3s ease;
}

.login:hover {
  background-color: orange;
  transform: scale(1.1);
  color: white;
}

.resigter:hover {
  background-color: orange;
  transform: scale(1.1);
  color: white;
}

.login:active { /* 点击时改变背景颜色 */
  transform: scale(0.98);
/
}

.resigter:active { /* 点击时改变背景颜色 */
  transform: scale(0.98);
/
}

/*.HeadArea{*/
/*  background-color: rgb(100,149,237,0.5);*/
/*}*/
/*.bodyArea{*/
/*  background-color: rgb(100,149,237,0.5);*/
/*}*/
.CommentArea {
  position: absolute;
  top: 800px;
  left: 800px;
}

#messageArea {
  margin-top: 20px;
}

.message {
  border: 1px solid #ddd;
  padding: 10px;
  margin-bottom: 10px;
  background-color: #f9f9f9;
}

.message-date {
  color: #666;
  font-size: 0.8em;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 设置导航栏样式 */
.Nav1 {
  background-color: rgb(25, 25, 112);
  overflow: hidden;
}

/* 设置导航列表样式 */
.nav-list {
  list-style-type: none;
}

/* 设置列表项样式 */
.nav-list li {
  float: left;
}

/* 设置链接样式 */
.nav-list li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* 鼠标悬停时的链接样式 */
.nav-list li a:hover {
  background-color: rgb(106, 90, 205);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 设置导航栏样式 */
.Nav2 {
  background-color: rgb(72, 61, 139);
  width: 200px; /* 设置导航栏的宽度 */
  height: 100%; /* 使导航栏占满整个屏幕高度 */
  position: fixed; /* 固定位置 */
  overflow: auto; /* 如果内容超出，则显示滚动条 */
}

/* 设置导航列表样式 */
.nav-list1 {
  list-style-type: none;
}

/* 设置列表项样式 */
.nav-list1 li {
  padding: 15px 20px; /* 设置内边距 */
}

/* 设置链接样式 */
.nav-list1 li a {
  display: block;
  color: rgb(255, 250, 205);
  text-decoration: none;
}

/* 鼠标悬停时的链接样式 */
.nav-list1 li a:hover {
  background-color: rgb(75, 0, 130);
}

#submitBtn {
  width: 100px;
  height: 30px;
  border-style: none;
  border-radius: 10%;
  background-color: rgb(0, 0, 205, 0.5);
  color: white;
}

#submitBtn:hover {
  background-color: rgb(25, 25, 112, 0.5);
}

#messageInput {
  width: 600px;
  height: 150px;
  background-color: rgb(119, 136, 153, 0.5);
}

.InputDivTitle {
  color: rgb(0, 191, 255);
}

.messageDiv {
  position: absolute;
  top: 300px;
}
